<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="/static/common/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>首页</title>
    <%@include file="../../public/commonCss.jsp" %>
    <link href="${ctx}/static/css/acss/model_jl.css" rel="stylesheet" type="text/css"/>
    <%@include file="../../public/commonJs.jsp" %>
    <%@include file="../../public/easyui.jsp" %>
    <style type="text/css">
        .bz {
            display: inline-block;
            width: 10px;
            height: 10px;
            border: 1px solid #999;
            margin: 1px;
        }

        .ms {
            margin-left: 3px
        }
    </style>
</head>
<body ms-controller="main" class="ms-controller">
<div id="wrapper">
    <div class="boxtoolbar whiteBox actionArea contentbox">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" class="layui-input Wdate" ms-duplex="searchKey.startDate"
                       onClick="WdatePicker({readOnly:true,maxDate:'%y-%M-%d'})" onchange="initCommgrid()">
            </div>
        </div>
        <div class="layui-inline">
            <div class="layui-input-inline">
                <select id="ss" class="easyui-combogrid" style="width: 250px;height: 35px">
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <div class="layui-input-inline">
                <button class="layui-btn layui-btn-normal layui-btn-small" onclick="loadTableData()">搜索</button>
                <button class="layui-btn layui-btn-primary layui-btn-small" onclick="resetData()">重置</button>
            </div>
        </div>
        <div class="layui-inline layui-form">
            <div class="layui-input-inline">
                <input type="radio" value="1" name="num" lay-filter='r1' title="武汉"
                       <c:if test="${num eq 1}">checked</c:if> />
                <input type="radio" value="0" name="num" lay-filter='r1' title="汉口"
                       <c:if test="${num eq 0}">checked</c:if>/>
                <input type="radio" value="" name="num" lay-filter='r1' title="全部"
                       <c:if test="${empty num}">checked</c:if>/>
                <input type="checkbox" name="tempTrain" lay-filter='r2' title="查看临客"
                       <c:if test="${tempTrain=='1'}">checked</c:if>/>
            </div>
        </div>
        <div class="layui-inline layui-form">
            <div class="layui-input-inline">
                <span>交路数量：</span>
                <span style="color:red">{{roadNum}}</span>
                <span style="margin-left:20px">出乘机械师数量：</span>
                <span style="color:red">{{userNum}}</span>
            </div>
        </div>
    </div>
    <div class="boxmain whiteBox lrbox" style="margin-top:-90px">
        <div class="from-body contentbox" style=" overflow: auto;">
            <table class="layui-table">
                <thead>
                <tr>
                    <th width="50" align="center">行号</th>
                    <th width="200" align="center">交路</th>
                    <th>车次
                        <span class="fr">
                            <span class="bz"></span><span class="ms">未开始</span>
                            <span class="jlred bz"></span> <span class="ms">进行中</span>
                            <span class="jlgreen bz"></span> <span class="ms">正常完成</span>
                            <span class="jlyellow bz"></span><span class="ms">提前</span>
                            <span class="jlbule bz"></span><span class="ms">延迟</span>
                        </span>
                    </th>
                </tr>
                </thead>
                <tbody>
                <tr ms-repeat="tableData">
                    <td align="center">{{$index+1}}</td>
                    <td align="center" style="position:relative;">
                        {{el.roadName}}
                        <div style="position:absolute;right:5px;bottom:5px;">
                            <img src="${ctx}/static/images/index/m.png" title="181故障" style="cursor: pointer;"
                                 width="20" height="20">
                            <img src="${ctx}/static/images/index/d.png" title="下载交路文件"
                                 ms-on-click="downLoadFiles(el.roadId)" style="cursor: pointer;" width="20"
                                 height="20">
                        </div>
                    </td>
                    <td style="padding-bottom: 0px;">
                        <div class="jlArea">
                            <div class="jlButton" style="width:250px;" ms-repeat-ell="el.trainUserWorkList">
                                <table class="layui-table" lay-skin="nob" style="margin: 5px 0" width="100%">
                                    <tr align="center">
                                        <td><span style="margin-right:5px;color: #999;">{{$index+1}}</span></td>
                                        <td><span style="font-size: 14px;color: #4287cf;">{{ell.trainCode}}</span>
                                        </td>
                                        <td><span
                                                style="font-size: 14px;color: #4287cf;">&nbsp;&nbsp;{{ell.trainType}}</span>
                                        </td>
                                        <td><span><a href="javascript:;" class="jlrowedit"></a></span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="2" align="left" style="width:100px">
                                            {{ell.startCity}}&nbsp;&nbsp;<span
                                                style="color: #999;">{{ell.startTime}}</span></td>
                                        <td colspan="2" align="right" style="width:150px">
                                            {{ell.endCity}}&nbsp;&nbsp;<span
                                                style="color: #999;">{{ell.endTime}}</span></td>
                                    </tr>
                                    <tr ms-repeat-elll="ell.users" ms-if="ell.users.size()>0">
                                        <td colspan="2" align="left" ms-each-ellll="elll.works" style="height:32px">
                                            <a href="javascript:;" ms-on-click="viewUserWork(ell)">
                                                    <span class="gx" ms-attr-title="ellll.workName"
                                                          ms-if="ellll.workStatus==0"> </span>
                                                <span class="jlred gx" ms-attr-title="ellll.workName"
                                                      ms-if="ellll.workStatus==1"> </span>
                                                <span class="jlgreen gx" ms-attr-title="ellll.workName"
                                                      ms-if="ellll.workStatus==2"> </span>
                                                <span class="jlyellow gx" ms-attr-title="ellll.workName"
                                                      ms-if="ellll.workStatus==3"> </span>
                                                <span class="jlbule gx" ms-attr-title="ellll.workName"
                                                      ms-if="ellll.workStatus==4"> </span>
                                            </a>
                                        </td>
                                        <td colspan="2" align="right">
                                            <a href="javascript:;" ms-on-click="selectUserWork(el,ell,elll)">
                                                <span style="color: green;">{{elll.trainNum}}&nbsp;&nbsp;{{elll.userName}}</span>
                                            </a>
                                        </td>
                                    </tr>
                                    <tr ms-if="ell.users.size()==1">
                                        <td colspan="2" align="left"><span style="color: green;">--</span></td>
                                        <td colspan="2" align="right"><span style="color: green;">--</span></td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

    <!-- whitebox -->
</div>
<script type="text/javascript">
    var vm;
    $(function () {
        vm = avalon.define({
            $id: "main",
            tableData: [],
            roadNum: 0,
            userNum: 0,
            searchKey: {
                startDate: '${today}',
                num: '${num}',
                tempTrain: '${tempTrain}'
            }
        });
        loadTableData();
        initCommgrid();
    });

    function loadSearchData() {
        loadTableData();
    }

    //初始化搜索列表
    function initCommgrid() {
        $('#ss').combogrid({
            panelWidth: 250,
            delay: 5,
            idField: 'roadId',
            prompt: '搜索交路、车次、人员、车组号',
            textField: 'trainCodeStr',
            fitColumns: true,
            url: '${ctx}/indexController/selectSearchData.action',
            mode: 'remote',
            queryParams: vm.$model.searchKey,
            columns: [[
                {field: 'trainCodeStr', title: '车次', width: 30},
                {field: 'userName', title: '用户名', width: 30},
                {field: 'trainNum', title: '车组号', width: 30}
            ]]
        });
    }

    //下载交路文件
    function downLoadFiles(id) {
        layerUtil.confirm("你确定下载该交路所有文件吗？", function () {
            closeDialog();
            var dataStr = {
                roadId: id,
                planDate: vm.searchKey.startDate
            };
            ajaxUtil.postDealCode("${ctx}/indexController/checkHasFile.action", dataStr, true, function (data) {
                console.log(data);
                if (data == 1) {
                    window.location.href = "${ctx}/indexController/downLoadFile.action?roadId=" + id + "&planDate=" + vm.searchKey.startDate
                } else {
                    layerUtil.fail("没有要下载的文件");
                }
            })
        })
    }

    //查询用户工序
    function selectUserWork(el, ell, elll) {
        var tabname = "巡检监测-" + elll.userName;
        var text = "巡检监测-" + elll.userName;
        var param = "?trainCode=" + encodeURIComponent(ell.trainCode) + "&loginId=" + elll.loginId;
        var href = "${ctx}/indexController/toFileList.action" + param;
        top.maincontab.opentabs(href, text, "0", tabname);
    }

    //跳转到日巡检工序
    function viewUserWork(ul) {
        var tabname = "日常巡检统计";
        var text = "日常巡检统计";
        var opentype = "0";
        var param = "?loginId=" + ul.user.loginId
            + "&trainCode=" + encodeURIComponent(ul.trainCode)
        var href = "${ctx}/countController/toUserCountInfo.action" + param;
        top.maincontab.opentabs(href, text, opentype, tabname);

    }

    //重置
    function resetData() {
        $('#ss').combogrid('setValue', '');
        loadTableData();
    }

    //加载菜单数据
    function loadTableData() {
        var dataStr = vm.$model.searchKey;
        dataStr.roadId = $('#ss').combogrid('getValue');
        ajaxUtil.post("${ctx}/indexController/selectAllRoads.action", dataStr, true, function (data) {
            vm.tableData = data.data;
            vm.roadNum = data.roadNum;
            vm.userNum = data.userNum;
        })
    }

    var form = layui.form();
    form.on('radio(r1)', function (data) {
        if (vm.$model.num != data.value) {
            vm.searchKey.num = data.value;
            console.log(data.value);
            loadTableData();
        }
    });
    form.on('checkbox(r2)', function (data) {
        if (data.elem.checked) {
            vm.searchKey.tempTrain = '1';
        } else {
            vm.searchKey.tempTrain = '';
        }
        loadTableData();
    });
    //监听提交
    form.render();
</script>
</body>
</html>